<?php _view("header"); ?>

<section class='body'>

<?php _view("nav"); ?>

<div class='content'>

	<div class='c'>

		<h3>
			All the config in group '<em><?=$data['group'];?></em>':
			<div class='r'>
			<form action='/' method='get'>
				<input type='hidden' name='module' value='config'>
				<input type='hidden' name='group' value='<?=$data['group'];?>'>
				<input type='text' name='query' size=15 value='<?=$data['query'];?>'>
				<input type='submit' value='Search'>
			</form>
			</div>
		</h3>

		<div>
		<table class='list' id='J-config-list'>
		<thead>
			<tr>
				<th width='20%'>Key</th>
				<th width='8%'>Type</th>
				<th>Value</th>
				<th width='8%'>Version</th>
				<th width='20%'>Update Time</th>
			</tr>
		</thead>
		<tbody>
		<?php $rows = $data['rows'];  ?>
		<?php foreach($rows as $r) { ?>
			<tr>
				<td><a href='/?module=config&group=<?=urlencode($group);?>&action=history&key=<?=urlencode($r['key']);?>'><?=__($r['key']);?></a></td>
				<td><?=C::getTypeText($r['val_type']);?></td>
				<td><?=__($r['value']);?></td>
				<td><?=$r['version'];?></td>
				<td><?=$r['update_time'];?></td>
			</tr>
		<?php } ?>
		</tbody>
		<tfoot>
			<tr>
				<td colspan=4 class='tl'>
					<a class='m10' id='J-config-add' href='javascript:void(0);'>Add new config</a>
				</td>
			</tr>
		</tfoot>
		</table>
		</div>
	</div>
<?php

$typeList = C::getTypeTextList();
$val_type_options = "";

foreach($typeList as $k => $r) {
	$val_type_options .= "<option value='$k'>$r</option>";
}

?>
<script>
(function() {
	function filter(str){
		return str.replace("<",	"&lt;").replace(">", "&gt;");
	}
	$("#J-config-add").click(function(evt) {
		var tbody = $("#J-config-list tbody");	
		var html = ["<tr>"];
		html.push("<td><input type='text' name='key' style='width:90%;'></td>");
		html.push("<td><select name='val_type'><?=$val_type_options;?></select></td>");
		html.push("<td colspan=3><input type='text' name='value' style='width:90%;'> <a href='#' class='save-as'>Save</a></td>");
		html.push("</tr>");
		$(html.join("")).appendTo(tbody);
	});
	$(".save-as").live("click", function(evt) {
		var tr = evt.target.parentNode.parentNode;
		var key = $(tr).find("input[name=key]").val(),
			value = $(tr).find("input[name=value]").val(),
			val_type = $(tr).find("select[name=val_type]").val();
		$.ajax({
			data : {key : key, val_type: val_type, value : value, group : '<?=$data['group'];?>'},	
			dataType : "json",
			error : function(xhr, textStatus, error) {
				alert(error);	
			},
			type : "POST",
			url : "/?module=config&action=edit&response_type=json",
			success : function(data, textStatus, xhr) {
				if(data.msg) {
					alert(data.msg);
				} else {
					var row = data.rows[0];
					var html = [];
					html.push("<td><a href='/?module=config&action=history&group="+row.group_name+"&key="+row.key+"'>" + filter(row.key) + "</a></td>");
					html.push("<td>" + row.val_type + "</td>");
					html.push("<td>" + filter(row.value) + "</td>");
					html.push("<td>" + row.version + "</td>");
					html.push("<td>" + row.update_time + "</td>");
					$(tr).html(html.join(""));
				}
			}
		});
	});
})();
</script>

</div>

</section>

<?php _view("footer"); ?>
